{% from "supersearch/macros/date_filters.html" import date_filters %}

{% extends "crashstats_base.html" %}
{% block page_title %}{{ signature }} - Signature report - Mozilla Crash Reports{% endblock %}

{% block site_css %}
  {{ super() }}
  {% stylesheet 'select2' %}
  {% stylesheet 'metricsgraphics' %}
  {% stylesheet 'search' %}
  {% stylesheet 'accordion' %}
  {% stylesheet 'tablesorter' %}
  {% stylesheet 'signature_report' %}
  {% stylesheet 'bugzilla' %}
{% endblock %}

{% block content %}
  <div id="mainbody"
       data-urls-summary="{{ url('signature:signature_summary') }}"
       data-urls-aggregations="{{ url('signature:signature_report') }}aggregation/"
       data-urls-reports="{{ url('signature:signature_reports') }}"
       data-urls-graphs="{{ url('signature:signature_report') }}graphs/"
       data-urls-bugzilla="{{ url('signature:signature_bugzilla') }}"
       data-urls-comments="{{ url('signature:signature_comments') }}"
       data-urls-correlations="{{ url('signature:signature_correlations') }}"

       data-channels="{{ channels | to_json }}"
       data-fields="{{ fields | to_json }}"
       data-columns="{{ columns | to_json }}"
       data-sort="{{ sort | join(',') }}"
       data-correlations-products="{{ correlations_products | to_json }}"
  >
    <div class="page-heading">
      <h2>Signature report for <em>{{ signature }}</em></h2>
      <p>
        <a href="#" class="display-toggle-filters toggle-filters show" data-text-opposite="Hide Filters">Show Filters</a>
        Showing results from {{ query.start_date | time_tag }} to {{ query.end_date | time_tag }}.
      </p>
    </div>

    <section id="search-form">
      <div class="loader"></div>

      <form method="get" action="{{ url('signature:signature_report') }}"
            data-fields-url="{{ url('supersearch:search_fields') }}?{{ make_query_string(exclude=['signature', 'date']) }}"
            data-signature="{{ signature }}"
      >
        <div class="form-controls">
          <button class="new-line">New line</button>
          <button type="submit" id="search-button">Search</button>
        </div>

        {{ date_filters(query.start_date, query.end_date) }}

        <fieldset id="search-params-fieldset"></fieldset>

        <div class="clear"></div>
      </form>
    </section>

    <nav id="panels-nav">
      <ul class="tabs">
        <li><a href="#summary" class="summary" data-tab-name="summary">Summary</a></li>
        <li><a href="#aggregations" class="aggregations" data-tab-name="aggregations">Aggregations</a></li>
        <li><a href="#reports" class="reports" data-tab-name="reports">Reports</a></li>
        <li><a href="#graphs" class="graphs" data-tab-name="graphs">Graphs</a></li>
        <li><a href="#bugzilla" class="bugzilla" data-tab-name="bugzilla">Bugzilla</a></li>
        <li><a href="#comments" class="comments" data-tab-name="comments">Comments</a></li>
        {% if product in correlations_products %}
          <li><a href="#correlations" class="correlations" data-tab-name="correlations">Correlations</a></li>
        {% endif %}
      </ul>
    </nav>

    <!-- Loading panel.
         Shows a loading bar, is displayed by default when the page is
         loading initial data.
    -->
    <section class="panel tab-panel" id="loading-panel">
      <header class="title">
        <h2>Loading&hellip;</h2>
      </header>

      <div class="body">
        <div class="loader"></div>
      </div>
    </section>
  </div>
{% endblock %}

{% block site_js %}
  {{ super() }}
  {% javascript 'd3' %}
  {% javascript 'jquery_ui' %}
  {% javascript 'tablesorter' %}
  {% javascript 'select2' %}
  {% javascript 'accordion' %}
  {% javascript 'dynamic_form' %}
  {% javascript 'moment' %}
  {% javascript 'timeutils' %}
  {% javascript 'socorro_utils' %}
  {% javascript 'bugzilla' %}
  {% javascript 'metricsgraphics' %}
  {% javascript 'correlation' %}
  {% javascript 'date_filters' %}
  {% javascript 'signature_report' %}
{% endblock %}
